<template>
	<view>
		<!-- 是否有邀请码确认 -->
		<view class="cu-modal" :class="modalName == 'invitecode' ? 'show' : ''">
			<view class="cu-dialog">
				<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚想确认</view>
				<view class="flex justify-center padding text-left text-lg">
					您的真的没有邀请人吗？
					<br />
					如果有，请输入邀请码
				</view>
				<view class="cu-bar bg-white justify-around action">
					<button class="cu-btn round bg-gray btnWidth" @tap="skinInviteCode">没有</button>
					<button class="cu-btn round bg-pink btnWidth" @tap="inputInviteCode">输入</button>
				</view>
			</view>
		</view>
		<!-- 进行淘宝授权提示 -->
		<view class="cu-modal" :class="modalName == 'tbshouquan' ? 'show' : ''">
			<view class="cu-dialog">
				<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚提醒您</view>
				<view class="flex justify-center padding text-left text-lg">为了保障您的收益，请立即进行淘宝授权</view>
				<view class="cu-bar bg-white justify-around action">
					<button class="cu-btn round bg-gray btnWidth" @tap="noShouQuan">暂不</button>
					<button class="cu-btn round bg-pink btnWidth" @tap="tbShouQuan">授权</button>
				</view>
			</view>
		</view>
		<!-- 清除历史搜索记录 -->
		<view class="cu-modal" :class="modalName == 'lssearch' ? 'show' : ''">
			<view class="cu-dialog">
				<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚提醒您</view>
				<view class="flex justify-center padding text-left text-lg">
					是否清理全部搜索历史？
					<br />
					该操作不可逆
				</view>
				<view class="cu-bar bg-white justify-around action">
					<button class="cu-btn round bg-gray btnWidth" @tap="cancelSearch">暂不</button>
					<button class="cu-btn round bg-pink btnWidth" @tap="clearSearch">清理</button>
				</view>
			</view>
		</view>
		<!-- 退出登录 -->
		<view class="cu-modal" :class="modalName == 'exitlogin' ? 'show' : ''">
			<view class="cu-dialog">
				<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚想知道</view>
				<view class="flex justify-center padding text-left text-lg">您真的要退出登录吗？</view>
				<view class="cu-bar bg-white justify-around action">
					<button class="cu-btn round bg-gray btnWidth" @tap="cancelExit">取消</button>
					<button class="cu-btn round bg-pink btnWidth" @tap="exitLogin">退出</button>
				</view>
			</view>
		</view>
		<!-- 未登录提示 -->
		<view class="cu-modal" :class="modalName == 'login' ? 'show' : ''">
			<view class="cu-dialog">
				<view class="bg-white content text-bold text-pink padding-tb text-xl">小聚提醒您</view>
				<view class="flex justify-center padding text-left text-lg">为了保障您的收益，请先登录</view>
				<view class="cu-bar bg-white justify-around action">
					<button class="cu-btn round bg-gray btnWidth" @tap="cancelLogin">取消</button>
					<button class="cu-btn round bg-pink btnWidth" @tap="login">登录</button>
				</view>
			</view>
		</view>
		<!-- 保存分享图片复制分享内容到剪切板提示 -->
		<view class="cu-modal" :class="modalName == 'timeline' ? 'show' : ''">
			<view class="cu-dialog">
				<view class="bg-white content text-bold text-pink padding-tb text-xl">去朋友圈分享</view>
				<view class="flex justify-center padding text-left text-lg">
					分享文案已自动复制
					<br />
					<br />
					图片已保存至手机相册
				</view>
				<view class="cu-bar bg-white justify-around action">
					<button class="cu-btn round bg-gray btnWidth" @tap="cancelShare">取消</button>
					<button class="cu-btn round bg-pink btnHeight" @tap="shareToTimeline">打开朋友圈</button>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
	props: {
		modalName: {
			type: String,
			default: ''
		}
	},
	methods: {
		skinInviteCode() {
			//跳过邀请码输入
			this.$emit('skinInviteCode');
		},
		inputInviteCode() {
			//输入邀请码
			this.$emit('inputInviteCode');
		},
		noShouQuan() {
			//暂不淘宝授权
			this.$emit('noShouQuan');
		},
		tbShouQuan() {
			//淘宝授权
			this.$emit('tbShouQuan');
		},
		cancelSearch() {
			//暂不清除历史记录
			this.$emit('cancelSearch');
		},
		clearSearch() {
			//确认清除历史记录
			this.$emit('clearSearch');
		},
		cancelExit() {
			//取消退出登录
			this.$emit('cancelExit');
		},
		exitLogin() {
			//确认退出登录
			this.$emit('exitLogin');
		},
		cancelLogin() {
			//取消登录
			this.$emit('cancelLogin');
		},
		login() {
			//确认登录
			this.$emit('login');
		},
		cancelShare() {
			//取消朋友圈分享
			this.$emit('cancelShare');
		},
		shareToTimeline() {
			//朋友圈分享
			this.$emit('shareToTimeline');
		}
	}
};
</script>

<style lang="scss">
	.btnHeight{
			height: 80rpx;
		}
	.btnWidth {
		width: 200rpx;
		height: 80rpx;
	}
</style>
